   <div class="row-fluid">
    <div class="span3">
	     <h6>descripcion</h6>
	     <input type="text" name="descripcion" value="${articuloInstance?.descripcion}"/>
	     <h6>tipo</h6>
	     <g:select id="tipo" name="tipo.id" noSelection="${[0:'']}" 
		     from="${com.merceria.TipoArticulo.list()}" value="${articuloInstance?.tipo?.id}" class="many-to-one"
		     optionValue="nombre" optionKey="id" onblur="obtenerSiguienteNroArticulo()"/>
         <h6>numeroArticulo</h6>
         <input id="numeroArticulo" type="text" name="numeroArticulo" value="${articuloInstance?.numeroArticulo}" />    
	     <h6>fraccionable</h6>
	     <g:checkBox id="fracc" name="fraccionable" onclick="validarFraccionable()" value="${articuloInstance?.fraccionable}" />
    </div>
    <div class="span3">
	     <h6>costo</h6>
	     <input id="costoCompleto" type="text" name="costoCompleto" value="${articuloInstance?.costoCompleto}" />
	     <h6>precio</h6>
	     <input id="precioCompleto" type="text" name="precioCompleto" onblur="calcularGanancia()" 
	     autocomplete="off" value="${articuloInstance?.precioCompleto}"/>  
	     <h6>ganancia</h6>
	     <input id="gananciaCompleto" type="text" id="gananciaCompleto" />
    </div>
    <div id="fraccion" class="span3" style="display:none">
	     <h6>costoFraccion</h6>
	     <input id="costoFraccion" type="text" name="costoFraccion" value="${articuloInstance?.costoFraccion}"/>
	     <h6>precioFraccion</h6>
	     <input id="precioFraccion" type="text" name="precioFraccion" 
	     onblur="calcularGananciaFraccion()" value="${articuloInstance?.precioFraccion}"/>
	     <h6>gananciaFraccion</h6>
	     <input id="gananciaFraccion" type="text"/>
    </div>    
    <div class="span3">
         <h6>cantidad</h6>
         <input type="text" name="cantidad" value="${articuloInstance?.cantidad}"/>
         <h6>puntoDePedido</h6>
         <input type="text" name="puntoDePedido" value="${articuloInstance?.puntoDePedido}"/>
    </div>
   </div>
   <script>
           $(document).ready(function(){

        	   validarFraccionable();
        	         calcularGanancia();
        	         calcularGananciaFraccion();
               });

   
		   function validarFraccionable()
		   {
		       if($('#fracc').attr('checked') == 'checked')
		       {
		           $('#fraccion').css('display','block');
		       }
		       else{
		      	 $('#fraccion').css('display','none');
		       }
		   }
		   
		   function calcularGanancia()
		   {
		       var costo = isNaN($('#costoCompleto').val()) ? 1 : $('#costoCompleto').val() ;
		       var precio = isNaN($('#precioCompleto').val()) ? 0 : $('#precioCompleto').val() ;
		
		       var ganancia = isNaN((((precio * 100)/costo) - 100).toFixed(2)) ? -1 : (((precio * 100)/costo) - 100).toFixed(2);
		       
		       $('#gananciaCompleto').val(ganancia);
		   }
		
		   function calcularGananciaFraccion()
		   {
		       var costo = isNaN($('#costoFraccion').val()) ? 1 : $('#costoFraccion').val() ;
			   var precio = isNaN($('#precioFraccion').val()) ? 0 : $('#precioFraccion').val() ;
		
		       var ganancia = isNaN((((precio * 100)/costo) - 100).toFixed(2)) ? -1 : (((precio * 100)/costo) - 100).toFixed(2);
		       
		       $('#gananciaFraccion').val(ganancia);
		   }     
   
   </script>